// Device/pages/History/components/tyfall-component/index.js
import dayjs from 'dayjs';
import {
    fetchTyfallHistory
} from '@/services/device'
import {
    logger,
    showToast
} from '@/utils/util'
const app = getApp();
let page_num = 1;
const typeMappings = {
    '3': '跌倒',
    '2': '进入',
    '1': '离开'
}
Component({
    properties: {
        data: {
            type: Object,
            default: null
        }
    },
    observers: {
        data(value) {
            page_num = 1;
            this.setData({
                ...value,
                list: []
            }, this.queryList)
        }
    },
    data: {
        staticPrefix: app.globalData.STATIC_PREFIX,
        iphoneBarHeight: app.globalData.IPHONE_BAR_HEIGHT,
        type: null,
        type_options: [{
            text: '全部',
            value: null
        }, {
            text: '进入',
            value: '2'
        }, {
            text: '离开',
            value: '1'
        }, {
            text: '跌倒',
            value: '3'
        }],
        minDate: dayjs().subtract(2, 'month').valueOf(),
        maxDate: new Date().getTime(),
        start_time: undefined,
        end_time: undefined,
        itemTitle: '筛选',
        device_imei: null,
        list: [],
        trigger: false
    },
    methods: {
        async queryList() {
            const {
                device_imei,
                type,
                start_time,
                end_time
            } = this.data;
            const page_size = 10;
            try {
                const params = {
                    device_imei,
                    type,
                    start_time,
                    end_time,
                    page_num,
                    page_size
                };
                const res = await fetchTyfallHistory(params);
                if (res.data.length == 0 && page_num > 1) {
                    showToast('暂无更多数据')
                    page_num -= 1;
                    return;
                }
                this.setData({
                    list: this.data.list.concat(res.data.map(item => {
                        return {
                            ...item,
                            type: typeMappings[item.type]
                        }
                    })),
                    trigger: false
                })
            } catch (error) {
                logger.log(error)
            }
        },
        onNext() {
            page_num += 1;
            this.queryList()
        },
        onRefresh() {
            page_num = 1;
            this.setData({
                list: [],
                trigger: true
            }, this.queryList)
        },
        onChange(e) {
            this.setData({
                type: e.detail,
                list: []
            }, this.queryList)
        },
        onConfirm() {
            const component = this.selectComponent('.calendar');
            if(component.data.currentDate.length < 2 || !component.data.currentDate[1]) {
                showToast('请选择正确的时间范围！');
                return;
            }
            this.setData({
                start_time: dayjs(this.selectComponent('.calendar').data.currentDate[0]).format('YYYY-MM-DD 00:00:00'),
                end_time: dayjs(this.selectComponent('.calendar').data.currentDate[1]).format('YYYY-MM-DD 23:59:59'),
                list: []
            }, () => {
                this.selectComponent('#item').toggle();
                this.queryList()
            })
        },
        onClose() {
            this.setData({
                start_time: undefined,
                end_time: undefined,
                list: []
            }, () => {
                this.selectComponent('#item').toggle();
                this.queryList()
            })
        }
    }
})